<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>title</title>

</head>

<body>
    <input type="button" value="小苏" id="btn" />>
    <script>

        function my$(id) {
            return document.getElementById(id);
        }
        //为同一个元素绑定多个不同的事件,指向相同的事件处理函数
        my$("btn").onclick = f1;
        my$("btn").onmouseover = f1;
        my$("btn").onmouseout = f1;
        function f1(e) {
            switch (e.type) {
                case "click":
                    alert("好帅哦");
                    break;
                case "mouseover":
                    this.style.backgroundColor = "red";
                    break;
                case "mouseout":
                    this.style.backgroundColor = "green";
                    break;
            }
        }
  //  my$("btn").onmouseover=function (e) {
  //    console.log(e);
  //  };
    </script>
</body>

</html>